<!doctype html>
<html lang="en">

<%@ include file="Include_Professor_Imports.jsp"%>
<%@ include file="Include_Design_Table.jsp"%> 
<head>
	<script>
		var questionsRow = new Array();
		var examsRow = new Array();

		function checkForm()
		{
			var examName = document.getElementById("examName");
			var questions = document.getElementById("getid");
			var intExp = /^\d+$/;	
			var floatExp = /^[-+]?[0-9]+(\.[0-9]+)?$/;

			if (examName.value == '' || examName.value.indexOf('\\') !== -1 || examName.value.indexOf('\'') !== -1 || examName.value.indexOf('\"') !== -1)
			{
				alert('Please enter a valid Exam Name.');
				return false;
			} 
			if (questions.value == '')
			{
				alert('Questions are not read properly.');
				return false;
			} 
			return true;
		}
		
	</script>
</head>
<body>
<!-- HEADER -->
<%@ include file="Include_Professor_Header.jsp"%>

<section id="secondary_bar">
<div class="user"><!-- <a class="logout_user" href="#" title="Logout">Logout</a> -->
</div>

<div class="breadcrumbs_container"><article class="breadcrumbs"><a
	href="Home.jsp">Home</a>
<div class="breadcrumb_divider"></div>
<a href="ProfessorViewExamServlet?type=Practice">Practice Exams</a>
<div class="breadcrumb_divider"></div>
<a class="current">Edit</a></article></div>
</section>
<!-- end of secondary bar -->

<%@ include file="Include_Professor_Menu.jsp"%>

<section id="main" class="column">

<%@ include file="Include_Professor_Message.jsp"%>

<c:set var="questions" value="${requestScope.questions }"></c:set>
<c:set var="exam" value="${requestScope.exam}"></c:set>

<form action="AddAndEditExamServlet?type=Practice&examID=${exam.examID}" method="post">
	<!-- end of post new article -->
	<article class="module width_full">
		<header>
			<h3>Practice Exam ID:</h3>
		</header>
		<div class="module_content">
			<fieldset><label>Exam Name</label> <input type="text"  id="examName" name="examName" value="${exam.examName}">
			</fieldset>
		<div class="clear"></div>		
		
			<input type="hidden" id="getid" name="examQuestions" value="0"/>
        	<script>var objinput = document.getElementById("getid");</script>
		<div class="tablemodule2" style="max-height: 400px; overflow: auto;">
			<h5>Questions <div style="margin-top: -22px; margin-left: 730px;">Search: <input name="filt" onKeyUp="filter2(this, 'questionTable', '1')" type="text"></div></h5>
			<table id="questionTable" class="tablesorter" cellspacing="0">
				<thead>
					<tr>
						<th>ID</th>
						<th>Question</th>
						<th>Category</th>
						<th>Type</th>
						<th>Answer</th>
						<th>Choices</th>
					</tr>
				</thead>
				<tbody>
				<c:forEach items="${questions}" var="questionObj" varStatus="x">
					<c:choose>
						<c:when test="${exam.questions.contains(questionObj)}">
							<tr onclick="multiplehighlight_6(this, objinput, questionsRow)" id="selectedQuestion${x.count}">
								<td class="select"><c:out value="${questionObj.questionID }"/> </td>
								<td class="select"><c:out value="${questionObj.question }"/></td>
								<td class="select"><c:out value="${questionObj.category}"/></td>
								<td class="select">
								<c:choose>
									<c:when test="${questionObj.getClass().getSimpleName() eq 'MultipleChoice'}">
										Multiple Choice
									</c:when>
									<c:otherwise>
										True or False
									</c:otherwise>
								</c:choose>
								</td>
								<td class="select"> <c:out value="${questionObj.answer }"/> </td>
								<td class="select">
									<c:forEach items="${questionObj.choices}" var="choices" varStatus="i" >
									
										<c:choose>
											<c:when test="${questions.size() eq i.count}">
												<c:out value="${ choices }" />
											</c:when>
											<c:otherwise>
												<c:out value="${choices}," />
											</c:otherwise>
										</c:choose>
																
									</c:forEach>
								</td>
							</tr>
							<script> 
									addObjInArray(document.getElementById("selectedQuestion${x.count}"),objinput,questionsRow);
							</script>
						</c:when>
						
						<c:otherwise>
							<tr onclick="multiplehighlight_6(this, objinput, questionsRow)">
								<td><c:out value="${questionObj.questionID }"/> </td>
								<td><c:out value="${questionObj.question }"/></td>
								<td><c:out value="${questionObj.category}"/></td>
								<td>
								<c:choose>
									<c:when test="${questionObj.getClass().getSimpleName() eq 'MultipleChoice'}">
										Multiple Choice
									</c:when>
									<c:otherwise>
										True or False
									</c:otherwise>
								</c:choose>
								</td>
								<td> <c:out value="${questionObj.answer }"/> </td>
								<td>
									<c:forEach items="${questionObj.choices}" var="choices" varStatus="i" >
									
										<c:choose>
											<c:when test="${questions.size() eq i.count}">
												<c:out value="${ choices }" />
											</c:when>
											<c:otherwise>
												<c:out value="${choices}," />
											</c:otherwise>
										</c:choose>
																
									</c:forEach>
								</td>
							</tr>
						</c:otherwise>
						
					</c:choose>
				</c:forEach>
				</tbody>
			</table>
		</div>
		<div class="spacer"></div>
		<div class="clear"></div>

		
		</div>
		<footer>
		<div class="submit_link"> <input type="submit" value="Update Exam" class="alt_btn" onclick="return checkForm()"> 
<!--			<input-->
<!--			type="submit" value="Reset">-->
			</div>
		</footer>
	</article>
	
	<!-- end of post new article -->
</form>


<div class="spacer"></div>
</section>


</body>

</html>